$(function () {
    $("#add").window({
        width: 500,
        height: 300,
        title: '新增角色',
        iconCls: 'icon-add',
        collapsible: true,
        minimizable: false,
        maximizable: false,
        resizable: false,
        closed: true
    });

    $("#edit").window({
        width: 500,
        height: 300,
        title: '修改角色',
        iconCls: 'icon-edit',
        collapsible: true,
        minimizable: false,
        maximizable: false,
        resizable: false,
        closed: true
    });

    $('#role-dg').datagrid({
        striped: true,
        pagination: true,
        rownumbers: true,
        fitColumns: true,
        scrollbarSize: 0,
        width: "auto",
        url: 'role?method=findByPage',
        onBeforeSelect: function () {
            return false;
        },
        columns: [[
            {field: 'role', title: '角色', width: 15},
            {field: 'instruction', title: '角色说明', width: 30},
            {field: 'user', title: '创建用户', width: 15},
            {field: 'userRole', title: '用户权限', width: 15},
            {field: 'createdTime', title: '创建时间', width: 15, align: 'center'},
            {field: 'updatedTime', title: '更新时间', width: 15, align: 'center'},
            {
                field: 'id', title: '操作', width: 15, formatter: function (value, row, index) {
                    let edit = '<button type="button" class="btn btn-primary btn-xs editClassBtn" name="edit" data-roleid="' + value + '"><i' +
                        ' class="fa' +
                        ' fa-pencil"></i>&nbsp;编辑</button>&nbsp;<button type="button" class="btn btn-danger btn-xs' +
                        ' delClassBtn" name="del" data-roleid="' + value + '"><i class="fa fa-trash"></i>删除</button>'
                    return edit;
                }, align: 'center'
            },
        ]],
        toolbar: [
            {
                iconCls: 'icon-add',
                text: "新增角色",
                handler: function () {
                    $("#add").window('open');
                    $("#role").focus();
                }
            }/*,
            {
                iconCls: 'icon-remove',
                text: "批量删除",
                handler: function () {

                }
            }*/
        ]
    });

    $("#addRole").click(function () {
        addRole("add");
    });
    $("#addRoleContinue").click(function () {
        addRole("continue");
    });

    let id = "";
    $("body").on("click", ".delClassBtn", function (e) {
        e.stopPropagation();
        id = $(this).attr("data-roleid");
        layer.confirm("确认删除该条数据吗？", {icon: 3, title: "删除确认"}, function (index) {
            $.get("role", {method: "delete", id: id}, function (data) {
                if (data.status === 20000) {
                    layer.msg(data.msg, {icon: 6, time: 1000}, function () {
                        reloadTable();
                    });
                } else {
                    layer.msg(data.msg, {icon: 5, time: 1000});
                }
            }, "json");
            layer.close(index);
        });
    });

    $("body").on("click", ".editClassBtn", function (e) {
        e.stopPropagation();
        $("#edit").window('open');
        id = $(this).attr("data-roleid");
        $.get("role", {method: "findById", id: id}, function (result) {
            $("#roleEdit").val(result.data.role);
            $("#descEdit").val(result.data.instruction);
            $("#roleLevelEdit").val(result.data.roleLevel);
        }, "json");
    });

    $("#updateRole").on("click", function () {
        let role = $.trim($("#roleEdit").val());
        let desc = $.trim($("#descEdit").val());
        let roleLevel = $.trim($("#roleLevelEdit").val());
        if (!role) {
            layer.msg("角色名称不能为空", {icon: 5, time: 1000});
            $("#roleEdit").trigger("focus");
            return;
        }
        if (!desc) {
            layer.msg("角色描述不能为空", {icon: 5, time: 1000});
            $("#descEdit").trigger("focus");
            return;
        }
        let json = {
            method: "update",
            roleId: id,
            role: role,
            desc: desc,
            roleLevel: roleLevel
        };
        $.post("role", json, function (result) {
            if (result.status === 20000) {
                layer.msg(result.msg, {icon: 6, time: 1000}, function () {
                    $("#edit").window('close');
                    reloadTable();
                });
            } else {
                layer.msg(result.msg, {icon: 5, time: 1000});
            }
        }, "json");
    });
});

function addRole(type) {
    let role = $("#role").val(),
        desc = $("#desc").val(),
        roleLevel = $("#roleLevel").val();

    if ($.trim(role).length === 0 || $.trim(desc).length === 0) {
        return;
    }

    $.ajax({
        type: "post",
        url: "role",
        data: {
            method: "save",
            role: role,
            desc: desc,
            roleLevel: roleLevel
        },
        dataType: "json",
        success: function (data) {
            if (data.status === 20000) {
                layer.msg(data.msg, {icon: 6, time: 1000}, function () {
                    reloadTable();
                    if (type === "add") {
                        $("#add").window('close');
                    }
                    $("#role").val("");
                    $("#desc").val("");
                });
            } else {
                layer.msg(data.msg, {icon: 5, time: 1000});
            }
        }
    });
}

function reloadTable() {
    $('#role-dg').datagrid('reload');
}
